<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/css/bootstrap.min.css">
    <style type="text/css">
        .container{
            margin-top: 4em;
        }

        /*学校模态框弹出效果*/
        .refresh{
            animation:mymove 1.5s linear infinite;
            -webkit-animation:mymove 1.5s linear infinite;
        }

        @keyframes mymove{
             0%{ 
                    transform:rotate(0deg);
                    -ms-transform:rotate(0deg);     /* IE 9 */
                    -moz-transform:rotate(0deg);    /* Firefox */
                    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
                    -o-transform:rotate(0deg);  
                }

                100%{
                    transform:rotate(360deg) ;
                     -ms-transform:rotate(360deg);     /* IE 9 */
                    -moz-transform:rotate(360deg);    /* Firefox */
                    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
                    -o-transform:rotate(360deg);  
                }
        }

        @-webkit-keyframes mymove{
                0%{ 
                    transform:rotate(0deg);
                    -ms-transform:rotate(0deg);     /* IE 9 */
                    -moz-transform:rotate(0deg);    /* Firefox */
                    -webkit-transform:rotate(0deg); /* Safari 和 Chrome */
                    -o-transform:rotate(0deg);  
                }

                100%{
                    transform:rotate(360deg) ;
                     -ms-transform:rotate(360deg);     /* IE 9 */
                    -moz-transform:rotate(360deg);    /* Firefox */
                    -webkit-transform:rotate(360deg); /* Safari 和 Chrome */
                    -o-transform:rotate(360deg);  
                }
        }
         /*学校模态框弹出效果*/
    </style>

    <script type="text/javascript" src="__PUBLIC__/js/jquery-1.12.3.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/bootstrap.min.js"></script>

    <script type="text/javascript">

    // 将选择好的学校增加到Input
    function addChooseSchool(chooseSchoolId,school){
        // chooseSchoolId
         $("#chooseSchool").text(school);
        $("#chooseSchoolId").val(chooseSchoolId);
        $("#sname").val(school);
        $("#schools").empty();
    }

     $(document).ready(function(){


            var schoolType=$("input[checked]").val();//学校类型

            $("input[name='schoolType']").click(function(){
                  schoolType=$(this).val();//学校类型
                  $("#schools").empty();//清空学校列表
                  $("#province").find("option").eq(0).attr("selected","selected");//省份默认值
                  $("#province").siblings("select").hide();//隐藏市,区下拉菜单
                  $("#chooseSchool").text("");
                   $("#chooseSchoolId").val("");
            });
            

            // 加载市
            $("#province").change(function(){             
                   $("#qu").empty().hide();
                     $("#city").hide();           
                   $data={
                        "pid":$(this).val(),
                        "area":"city",

                    };
                   $("#tips").show();

                 


                   if(schoolType!= 4){
                        // 加载市
                         $("#city").empty();
                       $.post("{:U('/Home/Register/getCity')}",$data,function(res){

                          $("#tips").hide();
                    
                        // $("#city").text('加载中');
                           // alert(res);
                           if(res){
                                $("#city").show();

                                $("#city").append(res);

                           }
                            
                       });
                   }


                    // 加载学校 
                    $("#schools").empty();//清空大学列表
                   if(schoolType==4){
                        $data={
                            "pid":$(this).val(),
                            "area":"city",
                            "schoolType":4

                         };
 
                       $.post("{:U('/Home/Register/getSchools')}",$data,function(res){
                            $("#tips").hide();
                           $('#myModal').modal("toggle");//加载完数据关闭模态框
                            // $("#city").text('加载中');
                         
                           if(res){
                               
                                $("#schools").empty().append(res);

                           }
                            
                       });
                   }                 
            });

            // 加载区
            $("#city").change(function(){
                    $("#tips").show();
                   $data={
                        "pid":$(this).val(),
                         "area":"qu",
                    };

               



                    // 加载区
                   $.post("{:U('/Home/Register/getCity')}",$data,function(res){
                        $("#tips").hide();
                      
                        if(res){

                            $("#qu").show();                      
                            $("#qu").empty().append(res);
                        }
                        
                   });

                    if(schoolType!= 4){
                           $("#schools").empty();

                            $data={
                                "pid":$(this).val(),
                                "area":"city",
                                "schoolType":schoolType,

                            };

                           $.post("{:U('/Home/Register/getSchools')}",$data,function(res){

                               $("#tips").hide();
                                
                              $("#schools").empty();
                               if(res){
                                     
                                     $("#schools").empty().append(res);

                               }
                                
                           });
                    }       
            });


            // 加载学校
            $("#qu").change(function(){
                         
                   $data={
                        "pid":$(this).val(),                      
                         "area":"qu"
                    };

                     $("#tips").show();
                    
                   // 加载学校
                    if(schoolType!=4){
                           $("#schools").empty();
                            // alert(schoolType);
                            $data={
                                "pid":$(this).val(),
                                "area":"city",
                                "schoolType":schoolType,

                            };
                           $.post("{:U('/Home/Register/getSchools')}",$data,function(res){
                                $("#tips").hide();
                                // $("#city").text('加载中');
                              
                              // $("#schools").empty();
                               if(res){
                                     
                                     $("#schools").append(res);

                               }
                                
                           });
                    }
                   
            });



            //  $("#province").change(function(){

            //     // alert($(this).val());

            //    if($(this).val()!=="0"){
            //         $("#refresh").addClass("refresh");
            //         // $('#myModal').modal("show");
            //         $('#myModal').modal(
            //         {
            //             backdrop:"static",
            //             keyboard: true
            //         }
            //         );

            //         setTimeout(function(){
            //            $('#myModal').modal("toggle");
            //         },5000);
                    
            //     }

            // })






     })
        
    </script>
</head>
<body>
<div class="container">
    <div class="top navbar-fixed-top text-center">
        <div class="logo">英文logo 用户注册</div>
    </div>
    <form class="form-horizontal" method="post" action="<?php echo U('Home/Register/index') ?>?id=<?php echo $user['id']; ?>">
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">用户名</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="user" id="" placeholder="用户名/请使用字母数字组合">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">昵称</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="ssid" id="" placeholder="昵称">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">密码</label>
            <div class="col-sm-10 col-xs-10">
                <input type="password" class="form-control" name="pass" id="" placeholder="密码">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">确认密码</label>
            <div class="col-sm-10 col-xs-10">
                <input type="password" class="form-control" name="repass" id="" placeholder="确认密码">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">邮箱</label>
            <div class="col-sm-10 col-xs-10">
                <input type="email" class="form-control" name="email" id="" placeholder="邮箱">
            </div>
        </div>
        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">手机</label>
            <div class="col-sm-10 col-xs-10">
                <input type="text" class="form-control" name="phone" id="" placeholder="手机">
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 col-xs-2 control-label">学校</label>
            <div class="col-sm-10 col-xs-10">
                <select id="province" >
                        <option value="">--选择省份--</option>
                            
                        <foreach name="area" item="v">
                            <option value="{$v.id}">{$v.name}</option>
                         </foreach> 
                </select>
                <select id="city" style="display:none">
                     
                </select>
                <select id="qu" style="display:none">
                    
                </select>

                <span class="label label-info" id="chooseSchool"></span>

                <!-- 最终提交学校数据的input -->
                <input type="hidden" id="chooseSchoolId" name="chooseSchoolId" />
                <input type="hidden" id="sname" name="sname" />

                <div id="schoolType">
                    <label class="pull-left checkbox-inline"><input type="radio" name="schoolType" value="4" checked >大学</label>
                    <label class="pull-left checkbox-inline"><input type="radio" name="schoolType" value="5" >高中</label>
                    <label class="pull-left checkbox-inline"><input type="radio" name="schoolType" value="6">初中</label>
                    <label class="pull-left checkbox-inline"><input type="radio" name="schoolType" value="7" >技校</label>
                  
                </div>
                
               
                 <div id="tips" style="color:red;display:none">搜索中.....</div>
                 
               

                 <div id="schools" class="col-sm-12 col-xs-12 control-label well"   style="font-size:12px">
                    
                 </div>
            </div>
        </div>
       
       <div id="res"></div>


        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-default">注册</button>
            </div>
        </div>
    </form>
</div>
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1261708147'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s11.cnzz.com/z_stat.php%3Fid%3D1261708147%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));</script>
</body>
</html>